@import '../common/init.scss';
@import '../common/constants.scss';
@import '../common/style.scss';
@import '../common/header.scss';
@import '../common/sidebar.scss';
@import '../common/window_control.scss';

.main{
	width: 100%;
	margin-top: 74px;
	.wrapper{
		width: $PageWidth;
		.articles-wrapper{
			background-color: #fff;
			width: $mainBoxWidth;
			box-sizing: border-box;
			padding: 20px;
			.article-group{
				.title{
					font-size: 25px;
				}
				.author-group{
					margin-top: 10px;
					width: 100%;
					height: 30px;
					line-height: 30px;
					.author-box{
						font-size: 14px;
						color: #878787;
						.author{
							a{
								color: #878787;
							}
						}
						.pub-time{
							margin-left: 10px;
						}
						.category{
							margin-left: 10px;
							padding: 0 5px 0;
							border-radius: 4px;
							display: inline-block;
							background-color: pink;
							color: #fff;
						}
					}
					.share-group{
						span{
							font-size: 14px;
							color: #696969;
						}
						a{
							display: block;
						    width: 30px;
						    height: 30px;
						    background-size: 220%;
							background: url('./../../dist/images/share.png') no-repeat;
							background-size: 240%;
						}
						.sina{
				            background-position: -42px 0;
				            margin-left: 10px;
				          }
					}
				}
			}
			.content{
				img{
					min-width: $mainBoxWidth;
				}
				padding-bottom: 10px;
				border-bottom: 1px solid $lineColor;
			}

			.comment-group{
				margin-top: 20px;
				.title{
					font-size: 20px;
					font-weight: bolder;
				}
				.comment-textarea{
					margin-top: 10px;
					border: 1px solid #000;
					border-radius: 5px;
					width: 100%;
					resize: none;
					padding: 5px;
				}
				.nologin-textarea{
					height: 40px;
			        line-height: 26px;
				}
				.comment-submit-btn-group{
					margin-top: 14px;
					.submit-btn{
			          cursor: pointer;
			          border-radius: 3px;
			          background-color: #878787;
			          border: none;
			          padding: 6px 10px;
			          color: #fff;
			        }
			        border-bottom: 1px solid $lineColor;
				}
				.comment-list{
					li{
						border-bottom: 1px solid $lineColor;
						padding: 10px 0;
						.comment-group{
							.left{
								display: block;
								line-height: 60px;
								img{
									width: 60px;
									height: 60px;
									border-radius: 50%;
								}
							}
							.right{
								margin-left: 20px;
								.author-box{
									.author{
										font-size: 18px;
									}
									.create-time{
										margin-left: 30px;
										font-size: 14px;
										color: #878787;
									}
								}
								.comment-info{
									margin-top: 5px;
									width: 670px;
								}
							}
						}
						.reply-group{
							
							.reply{
								font-size: 14px;
								color: #878787;
							}						}
					}
				}
			}	
		}
	}
}